<template>
    <div class="login-company-dialog">
    <basic-dialog :visible="show"
                  minWidth="400px"
                  title="选择客户"
                  :is-show-close="false"
                  :is-full-screen="false">
    <q-card-section>
        <div class="q-pa-md">
          <q-option-group
            :options="options"
            type="radio"
            v-model="loginCompanyId"
          />
        </div>
    </q-card-section>
    <q-separator />
        <div class="dialog-footer text-center q-mt-sm q-mb-sm">
          <q-btn class="btn q-mr-md" outline label="取消" color="primary" @click="$emit('close')"/>
          <q-btn class="btn" unelevated label="确认" color="primary" @click="login" :loading="logining"/>
        </div>
      </basic-dialog>
    </div>
</template>
<script>
import _ from 'lodash'
export default {
  name: 'login-company-dialog',
  props: {
    show: {
      type: Boolean,
      default: false,
      required: true
    },
    loginParams: Array
  },
  data () {
    return {
      logining: false,
      loginCompanyId: '',
      options: []
    }
  },
  watch: {
    loginParams: {
      handler (newPro) {
        console.log(newPro)
        this.options = newPro
        this.loginCompanyId = _.get(this.options[0], 'tid', '')
      },
      deep: true
    }
  },
  methods: {
    login () {
      console.log('登录')
      this.$emit('onLogin', this.loginCompanyId)
    }
  }
}
</script>
<style lang="stylus" scoped>
  .btn
    padding: 0
    min-width 96px
    min-height 32px
    line-height 1
    font-size 16px
    width 96px
    height 32px
    border-radius 6px
</style>
